<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sticky Navigation Menu with Smooth Scroll | No Javascript No JQuery</title>
    <link rel="stylesheet" href="./style.css">
</head>
<body>
    <div class="navbar">
        <a href="#" class="logo">Saffron</a>
        <ul class="nav">
            <li><a href="#home">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#portfolio">Portfolio</a></li>
            <li><a href="#services">Services</a></li>
            <li><a href="#contact">Contact</a></li>
        </ul>
    </div>
    <div class="banner-area" id="home"></div>
    <div class="about-area" id="about">
        <div class="text-part"></div>
        <h1>About Area</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit fuga, minus pariatur libero aliquam illum ex id aspernatur iure magnam excepturi tenetur nobis. Similique tempora itaque commodi suscipit doloribus veritatis.</p>
    </div>
    <div class="port-area" id="portfolio">
        <div class="text-part"></div>
        <h1>Portfolio Area</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit fuga, minus pariatur libero aliquam illum ex id aspernatur iure magnam excepturi tenetur nobis. Similique tempora itaque commodi suscipit doloribus veritatis.</p>
    </div>
    <div class="service-area" id="services">
        <div class="text-part"></div>
        <h1>Service Area</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit fuga, minus pariatur libero aliquam illum ex id aspernatur iure magnam excepturi tenetur nobis. Similique tempora itaque commodi suscipit doloribus veritatis.</p>
    </div>
    <div class="contact-area" id="contect">
        <div class="text-part"></div>
        <h1>Contact Area</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit fuga, minus pariatur libero aliquam illum ex id aspernatur iure magnam excepturi tenetur nobis. Similique tempora itaque commodi suscipit doloribus veritatis.</p>
    </div>
    
</body>
</html>